<script setup name="S00636TopicMachinePannel">
import S00636Component1 from './modules/S00636Component1.vue'
import S00636Component2 from './modules/S00636Component2.vue'
import S00636Component3 from './modules/S00636Component3.vue'
import S00636Component4 from './modules/S00636Component4.vue'

/* 
 设定时间

 运行时间

 剩余时间 （计算的）

 开机时间 在后台记录每天第一次推送的时间  跨天的话 取凌晨

 结束时间

 取值所有的客户的列
 星特昌的

*/
</script>

<template>
  <div class="S00636TopicMachinePannel ps_board">
    <ps-header :showDecoration5="false" />

    <div class="pannel">
      <div class="pannel-item one">
        <S00636Component1 />
      </div>
      <div class="pannel-item two">
        <S00636Component2 />
      </div>
      <div class="pannel-item three">
        <S00636Component3 />
      </div>
      <div class="pannel-item four">
        <S00636Component4 />
      </div>
    </div>
  </div>
</template>

<style scoped lang="scss">
.S00636TopicMachinePannel {
  display: flex;
  flex-direction: column;
}

.pannel {
  padding: 2px;
  flex: 1;
  display: grid;
  grid-template-columns: 2fr 2fr 2fr 3fr;
  // grid-template-rows: repeat(2, 1fr);
  grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  min-height: 0;
  overflow: hidden;
  &-item {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .one {
    grid-column: span 2;
  }

  .three {
    grid-row: span 2;
  }

  .four {
    grid-column: span 3;
  }
}
</style>
